{% extends "base.html" %}
  {% block content %}
    {% from "forms/macros.html" import render_field_busqueda %}
    <SCRIPT LANGUAGE="JavaScript">
	
		url = "/relacion/crear/ID/"
		url2 = "/relacion/eliminar/ID/"
		
		id_href = 'cre'
		id_href2 = 'eli'
 
		function obtener_id(id) {
        	link = document.getElementById(id_href)
        	link2 = document.getElementById(id_href2)
        	new_url = url.replace('ID', id)
        	new_url2 = url2.replace('ID', id)
        	link.href = new_url
        	link2.href = new_url2
        	
		}
		
	</SCRIPT>
    <h2><center> Administración de Relaciones </center> </h2>
    <form method="POST" action={{ url_for('relaciones.administracion_relacion') }} class="form"><center>
   		{{ form.csrf_token }} 	
   	 <div style="overflow:auto; width: 770px; height: 550px;" > 
   		
   	 <table> 
     	 <tr >
     	 	 <th></th>
  			 <th><label>Filtros</label></th>
     		 <th>{{ render_field_busqueda(form.nombre, class="input text") }}</th>
     		 <th>{{ render_field_busqueda(form.fase, class="input text") }}</th>
      	</tr >  			
  		<tr >
  			<th></th>
  			<th><center> ID </center></th>
      		<th><center> NOMBRE </center> </td>
      		<th><center> FASE </center></th>
      		<th><center> ANTECESOR ID </center></th>
      		<th><center> PADRE ID</center></th>
      	</tr >  		
		{% for item in items %}			
   				<tr >
   				  <th><input type = "radio" name = "seleccionado" id="select" onchange="obtener_id({{item.id}})"></th>
      			  <td> <center>{{ item.id }} </center></td>
      			  <td> <center>{{ item.nombre }} <center></td>
      			  <td> <center>{{ item.fase.nombre}} <center></td>
      			  <td> <center>{{ item.antecesor_id}} <center></td>
      			  <td> <center>{{ item.padre_id}} <center></td>
      			  
   				</tr>  		 	
		{% endfor %}				
		
	</table>     	
	</div>
	</br> 
    <div class="buttons">
                <button type="submit" class="button green">
                Buscar
                </button>
        <button type="submit" class="button green">
                <a href="" id="cre">Crear</a>
        </button>
        <button type="submit" class="button green">
                <a href="" id="eli">Eliminar</a>
        </button>
    </div>  
        
    </center></form>    
  {% endblock %}